import { BasicColumn, FormSchema } from "/@/components/Table";
import { h } from "vue";
import { Icon } from "/@/components/Icon";
import {  Switch } from "ant-design-vue";

/**
 * @Description : menu的类型，及 table，form
 * @author : xyg
 * @date : 2021-06-02 16:56
 */

export const columns: BasicColumn[] = [
  {
    title: "标题",
    dataIndex: "meta.title"
  },
  {
    title: "路由名称",
    dataIndex: "name",
    align: "left"
  },
  {
    title: "路径",
    dataIndex: "path"
  },

  {
    title: "重定向",
    dataIndex: "redirect"
  }
  ,

  {
    title: "图标",
    dataIndex: "meta.icon",
    customRender: ({ record }) => {
      const iconStr = record.meta.icon;
      return h(Icon, { icon: iconStr });
    }
  },
  {
    title: "固定",
    dataIndex: "meta.affix",
    customRender: ({ record }) => {
      const isAffix = record.meta.affix;
      return h(Switch, { checked: isAffix });
    }
  },
  {
    title: "是否缓存",
    dataIndex: "meta.ignoreKeepAlive",
    customRender: ({ record }) => {
      const ignoreKeepAlive = record.meta.ignoreKeepAlive;
      return h(Switch, { checked: !ignoreKeepAlive });
    }
  }
];


export const formSchemas: FormSchema[] = [
  {
    field: 'parentMenu',
    label: '上级菜单',
    component: 'TreeSelect',
    componentProps: {
      replaceFields: {
        title: 'menuName',
        key: 'id',
        value: 'id',
      },
      getPopupContainer: () => document.body,
    },
  },
];
